import { breakpointsTailwind, useBreakpoints } from "@vueuse/core";

// viewport breakpoints
const breakpoints = useBreakpoints(breakpointsTailwind);

const sm = breakpoints.smaller("sm"),
  md = breakpoints.between("sm", "md"),
  lg = breakpoints.between("md", "lg"),
  xl = breakpoints.between("lg", "xl"),
  xxl = breakpoints.between("xl", "2xl"),
  xxxl = breakpoints.greater("2xl");

export { breakpoints, sm, md, lg, xl, xxl, xxxl };
